<template>
  <nut-tabbar
    class="main-nav"
    @tab-switch="tabSwitch3"
    :tabbarList="tabList3"
    :bottom="true"
  >
  </nut-tabbar>
</template>

<script>
export default {
  name: 'MainNav',
    components: {

    },
    props:[
        "nav_index",
    ],
    data() {
        return {
            nav_n:0,
            tabList3:[
                {
                    'tabTitle':this.$t("MainNav.zy"),
                    'curr':this.nav_index == 0,
                    'icon':'/static/icons/nav/home.png',
                    'activeIcon':'/static/icons/nav/home-active.png',
                    'href':'/#/'
                },
                {
                    'tabTitle':this.$t("MainNav.hy"),
                    'curr':this.nav_index == 1,
                    'icon':'/static/icons/nav/vip.png',
                    'activeIcon':'/static/icons/nav/vip-active.png',
                    'href':'/#/member'
                },
                {
                    'tabTitle':this.$t("MainNav.rw"),
                    'curr':this.nav_index == 2,
                    'icon':'/static/icons/nav/task.png',
                    'activeIcon':'/static/icons/nav/task-active.png',
                    'href':'/#/task'
                },
                {
                    'tabTitle':this.$t("MainNav.jl"),
                    'curr':this.nav_index == 3,
                    'icon':'/static/icons/nav/order.png',
                    'activeIcon':'/static/icons/nav/order-active.png',
                    'href':'/#/order'
                },
                {
                    'tabTitle':this.$t("MainNav.wd"),
                    'curr':this.nav_index == 4,
                    'icon':'/static/icons/nav/me.png',
                    'activeIcon':'/static/icons/nav/me-active.png',
                    'href':'/#/profile'
                }
            ]
        };
    },
    methods: {
        tabSwitch3:function(value,index){
            //console.log(index);
        },
    },
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .main-nav{
    border-top:thin solid #efefef;
  }
</style>
